import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import {InfoCircleOutlined} from '@ant-design/icons';
import { Input, Modal, InputNumber, Upload, Button, Icon, Select, Radio, Card,Row, Col, Checkbox,message,Divider,Tooltip} from 'antd';
import { formatMessage,FormattedMessage } from 'umi-plugin-react/locale';
import { FormComponentProps } from '@ant-design/compatible/es/form';
import React, { useState } from 'react';
import { queryRule, updateRule, addRule, removeRule } from '../service';
import styles from '../style.less';

// 导入自定义组件1
import PreviewForm from '@/components/PreviewForm';
import * as BdHelper from '@/utils/BdHelper';
import * as DataHelper from '@/helpers/DataHelper';
import * as TsxHelper from '@/helpers/TsxHelper';

// 常量
const { TextArea } = Input;
const FormItem = Form.Item;

// 定义: 数据表单属性
interface DataFormProps extends FormComponentProps {
  // dataModalVisible: boolean;
  isUpdate: boolean
  dataFormValues: any
  common: any
}

// 数据表单
const DataForm: React.FC<DataFormProps> = props => {
  // 组件属性
  const { form, common, isUpdate, dataFormValues } = props;

  // 图片状态
  const [picture, setPicture] = useState<any[]>([]);
  const [uploadChanged, setUploadChanged] = useState<boolean>(false);
  const [pictureLogo, setPictureLogo] = useState<any[]>([]);
  const [uploadLogoChanged, setUploadLogoChanged] = useState<boolean>(false);
  const [previewModelVisible, handlePreviewModalVisible] = useState<boolean>(false);
  const [previewImg, setPreviewImg] = useState('');

    //提交表单
    const okHandle = () => {
      form.validateFields((err, fieldsValue) => {
        if (err) return;
        if(picture.length > 0){
          fieldsValue.file_id   = picture[0].file_id
          fieldsValue.file_url  = picture[0].file_url
        }
        
        console.log("submit fields ", fieldsValue)
        var submitValue = [
            {
              //请求当前一组配置参数，tag=interactives
              "alias_key": 'interactives',
              "item_type":'system',
              "dict_item_arr": [
                {
                  "alias_key": "post_hot",
                  "item_value": fieldsValue.post_hot,
                  'item_type':"number",
                },
                {
                  "alias_key": "comment_preview",
                  "item_value": fieldsValue.comment_preview,
                  'item_type':"number",
                },
                {
                  "alias_key": "nearby_length",
                  "item_value": fieldsValue.nearby_length,
                  'item_type':"number",
                },
                {
                  "alias_key": "group_level",
                  "item_value": fieldsValue.group_level,
                  'item_type':"radio",
                },
                {
                  "alias_key": "hashtag_show",
                  "item_value": fieldsValue.hashtag_show,
                  'item_type':"radio",
                },
                {
                  "alias_key": "dialog_status",
                  "item_value": fieldsValue.dialog_status,
                  'item_type':"radio",
                },
                {
                  "alias_key": "dialog_files",
                  "item_value": fieldsValue.dialog_files,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "interact_behavior",
                  "item_value": fieldsValue.interact_behavior,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "like_member_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('like_member_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "like_group_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('like_group_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "like_hashtag_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('like_hashtag_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "like_post_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('like_post_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "like_comment_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('like_comment_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "follow_member_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('follow_member_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },

                {
                  "alias_key": "follow_group_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('follow_group_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "follow_hashtag_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('follow_hashtag_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "follow_post_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('follow_post_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "follow_comment_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('follow_comment_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "shield_member_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('shield_member_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "shield_group_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('shield_group_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "shield_post_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('shield_post_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "shield_comment_setting",
                  "item_value": fieldsValue.interact_behavior.indexOf('shield_comment_setting') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "check_content",
                  "item_value": fieldsValue.check_content,
                  'item_type':"checkbox",
                },

                {
                  "alias_key": "it_publish_posts",
                  "item_value": fieldsValue.check_content.indexOf('it_publish_posts') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_publish_comments",
                  "item_value": fieldsValue.check_content.indexOf('it_publish_comments') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_likers",
                  "item_value": fieldsValue.check_content.indexOf('it_likers') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_followers",
                  "item_value": fieldsValue.check_content.indexOf('it_followers') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_shielders",
                  "item_value": fieldsValue.check_content.indexOf('it_shielders') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_like_members",
                  "item_value": fieldsValue.check_content.indexOf('it_like_members') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_like_groups",
                  "item_value": fieldsValue.check_content.indexOf('it_like_groups') > -1 ? true : false,
                  'item_type':"checkbox",
                },

                {
                  "alias_key": "it_like_hashtags",
                  "item_value": fieldsValue.check_content.indexOf('it_like_hashtags') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_like_posts",
                  "item_value": fieldsValue.check_content.indexOf('it_like_posts') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_like_comments",
                  "item_value": fieldsValue.check_content.indexOf('it_like_comments') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_follow_members",
                  "item_value": fieldsValue.check_content.indexOf('it_follow_members') > -1 ? true : false,
                  'item_type':"checkbox",
                },

                {
                  "alias_key": "it_follow_groups",
                  "item_value": fieldsValue.check_content.indexOf('it_follow_groups') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_follow_hashtags",
                  "item_value": fieldsValue.check_content.indexOf('it_follow_hashtags') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_follow_posts",
                  "item_value": fieldsValue.check_content.indexOf('it_follow_posts') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_follow_comments",
                  "item_value": fieldsValue.check_content.indexOf('it_follow_comments') > -1 ? true : false,
                  'item_type':"checkbox",
                },

                {
                  "alias_key": "it_shield_members",
                  "item_value": fieldsValue.check_content.indexOf('it_shield_members') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_shield_groups",
                  "item_value": fieldsValue.check_content.indexOf('it_shield_groups') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_shield_hashtags",
                  "item_value": fieldsValue.check_content.indexOf('it_shield_hashtags') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_shield_posts",
                  "item_value": fieldsValue.check_content.indexOf('it_shield_posts') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_shield_comments",
                  "item_value": fieldsValue.check_content.indexOf('it_shield_comments') > -1 ? true : false,
                  'item_type':"checkbox",
                },
                {
                  "alias_key": "it_home_list",
                  "item_value": fieldsValue.it_home_list,
                  'item_type':"checkbox",
                },
              ]
            }
        ]
        // 如果更新成功之后，重置表单
        updateRule({config_json: JSON.stringify(submitValue)}).then((res:any) => {
          console.log('handleSubmit then success is ', JSON.stringify(submitValue))
          if(res.code == 0){
            // form.resetFields()
            // setPicture([]);
            message.success('保存成功');
          }else{
            message.error(res.message);
          }
        })
  
      });
    };


  const parseData = (key:any,options:any) => {
    // console.log(options);
    var name:any = "";
    if(Array.isArray(options) && options.length>0){
      options.map(item=>{
        if(item.alias_key == key){
          name = item?.item_value;
        }
      })
    }
    return name
  }

  // 初始化变量
  const token = BdHelper.getBdToken()


  const formItemLayout = {
    labelCol: {
      xs: { span: 24 },
      sm: { span: 7 },
    },
    wrapperCol: {
      xs: { span: 24 },
      sm: { span: 12 },
      md: { span: 10 },
    },
  };
  

  // 弹出框
  // @ts-ignore
  return <div>
    {/* <Card title={'门户功能设置'} className={styles.card} bordered={false}>
      <Row gutter={16}>
        <Col lg={6} md={12} sm={24}>
          <FormItem 
          label={
            <span>
              <FormattedMessage id="门户频道功能" />
              <em className={styles.optional}>
                <Tooltip title={<FormattedMessage id="启用后，需安装相应的插件管理门户内容" />}>
                  <InfoCircleOutlined style={{ marginRight: 4,marginLeft: 4 }} />
                </Tooltip>
              </em>
            </span>
          }>
            {form.getFieldDecorator('portal_status', {
              initialValue: parseData('portal_status',dataFormValues),
              // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
            })(<Radio.Group buttonStyle="solid">
            <Radio value={true}>开启</Radio>
            <Radio value={false}>关闭</Radio>
          </Radio.Group>)}
          </FormItem>
        </Col>
      </Row>
    </Card> */}

    <Card title={'内容功能设置'} className={styles.card} bordered={false}>
      <Row>
        <Col span={12}>
          <FormItem label={'话题功能形式'} labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}>
              {form.getFieldDecorator('hashtag_show', {
                initialValue: parseData('hashtag_show',dataFormValues),
              })(<Radio.Group buttonStyle="solid" defaultValue={true}>
              <Radio value={'1'}>单 # 号</Radio>
              <Radio value={'2'}>双 # 号</Radio>
            </Radio.Group>)}
          </FormItem>
        </Col>
        <Col offset={1} span={9}>
          <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}> <a href="#">#话题</a> 和 <a href="#">#话题#</a> 的区别</span>
        </Col>
      </Row>
      <Row>
          <Col span={12}>
            <FormItem label={'帖子热评条件'} labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}>
            {form.getFieldDecorator('post_hot', {
              initialValue: parseData('post_hot',dataFormValues),
            })(<InputNumber style={{width:'100%'}}/>)}
            </FormItem>
          </Col>
          <Col offset={1} span={9}>
            <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>评论点赞总数达到多少开启热评功能，0 代表不启用</span>
          </Col>
      </Row>
      <Row>
          <Col span={12}>
            <FormItem label={'评论预览数量'} labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}>
              {form.getFieldDecorator('comment_preview', {
                initialValue: parseData('comment_preview',dataFormValues),
                // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
              })(<InputNumber placeholder={""} style={{width:'100%'}}/>)}
            </FormItem>
          </Col>
          <Col offset={1} span={9}>
            <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>评论列表子级评论预览，0 代表不启用，最大数字 3</span>
          </Col>
      </Row>
      <Row>
          <Col span={12}>
            <FormItem label={'附近帖子默认范围'} labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}>
              {form.getFieldDecorator('nearby_length', {
                initialValue: parseData('nearby_length',dataFormValues),
                // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
              })(<InputNumber placeholder={""} style={{width:'100%'}}/>)}
            </FormItem>
          </Col>
          <Col offset={1} span={9}>
            <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>范围单位以多语言配置为准，默认是公里 km</span>
          </Col>
      </Row>
    </Card>
    
    <Card title={'会话功能设置'} className={styles.card} bordered={false}>
      <Row>
          <Col span={12}>
            <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}
            label={
              <span>
                <FormattedMessage id="私信会话功能" />
              </span>
            }>
              {form.getFieldDecorator('dialog_status', {
                initialValue: parseData('dialog_status',dataFormValues),
                // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
              })(<Radio.Group buttonStyle="solid">
              <Radio value={true}>开启</Radio>
              <Radio value={false}>关闭</Radio>
            </Radio.Group>)}
            </FormItem>
          </Col>
          <Col offset={1} span={9}>
            <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>开启后，私聊会话权限以用户角色为准</span>
          </Col>
      </Row>
      <Row>
      {
          form.getFieldValue('dialog_status') == true && <>
            <Col span={12}>
              <FormItem labelCol={{ span: 5 }} wrapperCol={{ span: 19 }} style={{marginBottom: 15}}
              label={
                <span>
                  <FormattedMessage id="私信会话附件" />
                </span>
              }>
                {form.getFieldDecorator('dialog_files', {
                  initialValue: parseData('dialog_files',dataFormValues),
                  // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
                })(<Checkbox.Group onChange={(list)=>{console.log(list)}}>
                    <Checkbox value="1">图片</Checkbox>
                    <Checkbox value="2">视频</Checkbox>
                    <Checkbox value="3">音频</Checkbox>
                    <Checkbox value="4">文件</Checkbox>
                </Checkbox.Group>)}
              </FormItem>
            </Col>
            <Col offset={1} span={9}>
              <span style={{height:32,lineHeight:'32px',display:'block',marginTop:2}}>如果全部不勾选则代表只支持纯文字的对话</span>
            </Col>
          </>
        }
      </Row>
    </Card>

    <Card title={
        <span>
        <FormattedMessage id="互动行为设置" />
        <em className={styles.optional}>
          <Tooltip title={<FormattedMessage id="勾选则代表开启对应的互动功能" />}>
            <InfoCircleOutlined style={{ marginRight: 4,marginLeft: 4 }} />
          </Tooltip>
        </em>
      </span>
      } className={styles.card} bordered={false}>
    <Row>
      <Col span={18}>
      <FormItem label={''} className={styles.check}>
        {form.getFieldDecorator('interact_behavior', {
          initialValue: [
            parseData('like_member_setting',dataFormValues)?'like_member_setting':'',
            parseData('like_group_setting',dataFormValues)?'like_group_setting':'',
            parseData('like_hashtag_setting',dataFormValues)?'like_hashtag_setting':'',
            parseData('like_post_setting',dataFormValues)?'like_post_setting':'',
            parseData('like_comment_setting',dataFormValues)?'like_comment_setting':'',

            parseData('follow_member_setting',dataFormValues)?'follow_member_setting':'',
            parseData('follow_group_setting',dataFormValues)?'follow_group_setting':'',
            parseData('follow_hashtag_setting',dataFormValues)?'follow_hashtag_setting':'',
            parseData('follow_post_setting',dataFormValues)?'follow_post_setting':'',
            parseData('follow_comment_setting',dataFormValues)?'follow_comment_setting':'',

            parseData('shield_member_setting',dataFormValues)?'shield_member_setting':'',
            parseData('shield_group_setting',dataFormValues)?'shield_group_setting':'',
            parseData('shield_hashtag_setting',dataFormValues)?'shield_hashtag_setting':'',
            parseData('shield_post_setting',dataFormValues)?'shield_post_setting':'',
            parseData('shield_comment_setting',dataFormValues)?'shield_comment_setting':'',
          ]
        })(<Checkbox.Group onChange={(list)=>{console.log(list)}}>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Checkbox value="like_member_setting">点赞成员</Checkbox>
              <Checkbox value="like_group_setting">点赞小组</Checkbox>
              <Checkbox value="like_hashtag_setting">点赞话题</Checkbox>
              <Checkbox value="like_post_setting">点赞帖子</Checkbox>
              <Checkbox value="like_comment_setting">点赞评论</Checkbox>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)',borderTop:'none',borderBottom:'none'}}>
              <Checkbox value="follow_member_setting">关注成员</Checkbox>
              <Checkbox value="follow_group_setting">关注小组</Checkbox>
              <Checkbox value="follow_hashtag_setting">关注话题</Checkbox>
              <Checkbox value="follow_post_setting">关注帖子</Checkbox>
              <Checkbox value="follow_comment_setting">关注评论</Checkbox>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Checkbox value="shield_member_setting">屏蔽成员</Checkbox>
              <Checkbox value="shield_group_setting">屏蔽小组</Checkbox>
              <Checkbox value="shield_hashtag_setting">屏蔽话题</Checkbox>
              <Checkbox value="shield_post_setting">屏蔽帖子</Checkbox>
              <Checkbox value="shield_comment_setting">屏蔽评论</Checkbox>
              </div>
              
          </Checkbox.Group>)}
      </FormItem>
    </Col>
  </Row>
  </Card>

  <Card title={'查看别人内容设置'} className={styles.card} bordered={false}>
    <Row>
      <Col span={18}>
      <FormItem label={'哪些内容可以被别人查看？'} className={styles.check}>
        {form.getFieldDecorator('check_content', {
          initialValue: [
            parseData('it_publish_posts',dataFormValues)?'it_publish_posts':'',
            parseData('it_publish_comments',dataFormValues)?'it_publish_comments':'',
            parseData('it_like_members',dataFormValues)?'it_like_members':'',
            parseData('it_like_groups',dataFormValues)?'it_like_groups':'',
            parseData('it_like_hashtags',dataFormValues)?'it_like_hashtags':'',

            parseData('it_like_posts',dataFormValues)?'it_like_posts':'',
            parseData('it_like_comments',dataFormValues)?'it_like_comments':'',
            parseData('it_follow_members',dataFormValues)?'it_follow_members':'',
            parseData('it_follow_groups',dataFormValues)?'it_follow_groups':'',
            parseData('it_follow_hashtags',dataFormValues)?'it_follow_hashtags':'',

            parseData('it_follow_posts',dataFormValues)?'it_follow_posts':'',
            parseData('it_follow_comments',dataFormValues)?'it_follow_comments':'',
            parseData('it_shield_members',dataFormValues)?'it_shield_members':'',
            parseData('it_shield_groups',dataFormValues)?'it_shield_groups':'',
            parseData('it_shield_hashtags',dataFormValues)?'it_shield_hashtags':'',
            parseData('it_shield_posts',dataFormValues)?'it_shield_posts':'',
            parseData('it_shield_comments',dataFormValues)?'it_shield_comments':'',
          ],
          // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
        })(<Checkbox.Group onChange={(list)=>{console.log(list)}}>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Checkbox value="it_publish_posts">TA 发表的帖子</Checkbox>
              <Checkbox value="it_publish_comments">TA 发表的评论</Checkbox>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)',borderTop:'none',borderBottom:'none'}}>
              <Checkbox value="it_like_members">TA 点赞的成员</Checkbox>
              <Checkbox value="it_like_groups">TA 点赞的小组</Checkbox>
              <Checkbox value="it_like_hashtags">TA 点赞的话题</Checkbox>
              <Checkbox value="it_like_posts">TA 点赞的帖子</Checkbox>
              <Checkbox value="it_like_comments">TA 点赞的评论</Checkbox>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Checkbox value="it_follow_members">TA 关注的成员</Checkbox>
              <Checkbox value="it_follow_groups">TA 关注的小组</Checkbox>
              <Checkbox value="it_follow_hashtags">TA 关注的话题</Checkbox>
              <Checkbox value="it_follow_posts">TA 关注的帖子</Checkbox>
              <Checkbox value="it_follow_comments">TA 关注的评论</Checkbox>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)',borderTop:'none'}}>
              <Checkbox value="it_shield_members">TA 屏蔽的成员</Checkbox>
              <Checkbox value="it_shield_groups">TA 屏蔽的小组</Checkbox>
              <Checkbox value="it_shield_hashtags">TA 屏蔽的话题</Checkbox>
              <Checkbox value="it_shield_posts">TA 屏蔽的帖子</Checkbox>
              <Checkbox value="it_shield_comments">TA 屏蔽的评论</Checkbox>
              </div>
          </Checkbox.Group>)}
      </FormItem>
    </Col>
  </Row>
  <Row>
      <Col span={18}>
      <FormItem label={'访问 TA 的主页时，默认内容列表'} className={styles.check}>
        {form.getFieldDecorator('it_home_list', {
          initialValue: parseData('it_home_list',dataFormValues),
          // rules: [{ required: true, message: formatMessage({ id: 'app.base.please_input_min_1' }) , min: 1 }],
        })(<Radio.Group onChange={(list)=>{console.log(list)}}>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Radio value="it_publish_posts">TA 发表的帖子</Radio>
              <Radio value="it_publish_comments">TA 发表的评论</Radio>
              <Radio value="it_likers">点赞 TA 的成员</Radio>
              <Radio value="it_followers">关注 TA 的成员</Radio>
              <Radio value="it_shielders">屏蔽 TA 的成员</Radio>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)',borderTop:'none',borderBottom:'none'}}>
              <Radio value="it_like_members">TA 点赞的成员</Radio>
              <Radio value="it_like_groups">TA 点赞的小组</Radio>
              <Radio value="it_like_hashtags">TA 点赞的话题</Radio>
              <Radio value="it_like_posts">TA 点赞的帖子</Radio>
              <Radio value="it_like_comments">TA 点赞的评论</Radio>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)'}}>
              <Radio value="it_follow_members">TA 关注的成员</Radio>
              <Radio value="it_follow_groups">TA 关注的小组</Radio>
              <Radio value="it_follow_hashtags">TA 关注的话题</Radio>
              <Radio value="it_follow_posts">TA 关注的帖子</Radio>
              <Radio value="it_follow_comments">TA 关注的评论</Radio>
              </div>
              <div style={{padding: '.75rem 1.25rem',border: '1px solid rgba(0,0,0,.125)',borderTop:'none'}}>
              <Radio value="it_shield_members">TA 屏蔽的成员</Radio>
              <Radio value="it_shield_groups">TA 屏蔽的小组</Radio>
              <Radio value="it_shield_hashtags">TA 屏蔽的话题</Radio>
              <Radio value="it_shield_posts">TA 屏蔽的帖子</Radio>
              <Radio value="it_shield_comments">TA 屏蔽的评论</Radio>
              </div>
          </Radio.Group>)}
      </FormItem>
    </Col>
  </Row>
  </Card>
    
    <Col span={24}>
      <div style={{display: 'flex',justifyContent:'center',marginTop:20,}}>
        <Button type="primary" style={{marginLeft:30}} onClick={()=>{okHandle()}}>保存</Button>
      </div>
    </Col>
    {
      previewModelVisible && (
        <PreviewForm
          previewModelVisible={previewModelVisible}
          onVisibleModel={handlePreviewModalVisible}
          previewImg={previewImg}
        />
      )
    }
  </div>;
};

export default Form.create<DataFormProps>()(DataForm);
